*{ padding:0; margin:0;}
html, body { width: 100%; font-family: "microsoft yahei"; font-size: 14px; margin: 0; padding: 0; color: #333333; background: #f5f5f5;}
div, form, img, ul, ol, li, dl, dt, dd { font-family: "microsoft yahei"; margin: 0; padding: 0; list-style: none; border: none;}
a { text-decoration: none; color: #333;}
a:hover { text-decoration: none;}
p, span, em { margin: 0; padding: 0; font-style: normal; font-weight: normal;}
h1, h2, h3, h4, h5, h6, b { font-size: 14px; font-weight: normal; margin: 0; padding: 0;}
input, textarea { font-size: 14px; outline: none; background: none; border: 0; resize: none; width: 100%; font-family: "microsoft yahei";}
button{ border: none; }
::-moz-selection{background:#237B7B; color: #fff; }
::selection{background:#237B7B; color: #fff; }
.fl { float: left;}
.fr { float: right;}
.clear { clear: both;}
.container { width: 1300px; margin: 0 auto;}

.m20 { margin-top: 20px;}
.m30 { margin-top: 30px;}
.pt30 { padding-top: 30px;}
.pt40 { padding-top: 40px;}
.p40 { padding: 40px 0;}
.top { height: 35px; font:12px/35px "microsoft yahei"; color:#666;}
.top .fl ul li { float: left; margin-right: 40px;}
.top .fr ul li { float: left; position: relative;}
.top .fr ul li a { padding: 0 10px; display: block; color:#666;}
.top ul li a:hover { color: #ff6900;}
.top .fr ul li.drop-down { border-left: 1px #f5f5f5 solid; border-right: 1px #f5f5f5 solid;}
.top .fr ul li.hover { background: #fff; border-left: 1px #ddd solid; border-right: 1px #ddd solid;}
.top .fr ul li.hover .drop-down-content { display: block;}
.drop-down .drop-down-content { padding:10px 10px 10px 15px; text-align: center;}
.drop-down .drop-down-content img { display: block; width: 132px;}
.drop-down-content { display: none; position: absolute; width: 300px; background: #fff; border: 1px solid #eaeaea; border-top: none; left: -1px; top: 35px; z-index: 999;}
.drop-down-content dl{ float: left; width: 100%; text-align: left; border-bottom: 1px dashed #ccc; padding-bottom: 10px; margin-bottom: 10px;}
.drop-down-content dl:last-child{ border-bottom: none; padding-bottom: 0; }
.drop-down-content dl dt{float: left; width: 60px; font: 15px/25px "Microsoft yahei"; font-weight: bold; }
.drop-down-content dl dd{float: left; width: 60px; font: 14px/25px "Microsoft yahei";}
.drop-down-content dl a{ color: #333; padding: 0 !important; }
.head { background: #fff; height: 60px; padding: 30px 0;}
.logo img { height: 60px; display: block;}
.headline { padding: 0 0 0 20px; margin-top: 8px; border-left: 1px #ddd solid;}
.headline ul{ }
.headline ul li { font-size: 16px; }
.headline ul li:first-child{ -webkit-animation: scaleDraw 3s ease-in-out infinite; color:#fb0000; }
@keyframes scaleDraw {  
            0%{ color: #f59f00; transform: scale(1);   }
            25%{ color:#fb0000; transform: scale(1.045);  }
            50%{ color:#f59f00; transform: scale(1); }
            75%{ color:#fb0000; transform: scale(1.045); }
        }
.headline ul li:last-child{ font:14px/25px "microsoft yahei"; color: #777;  }

.search{height:40px; margin:10px 0 0 60px; position:relative;width:461px;z-index:105;}
.search .search-wrap {height: 34px;border: 1px solid #237B7B;background: #FFF !important; position: relative;}
.search .search-wrap .search-option {border: none;position: relative;border-right: 1px solid #237B7B;width: 80px;height: 34px;color: #555;line-height: 34px;text-decoration: none;text-align: center;padding-right: 12px;vertical-align: middle;display: block;float: left;font-size: 14px;overflow: hidden;cursor: pointer;}
.search .search-wrap dl.select {display: block;position: absolute;top: 34px;left: -1px;border: 1px solid #dcdcdc;width: 92px;line-height: 34px;text-align: center;background-color: #fff; z-index: 9999;}
.search .search-wrap dl.select dd {cursor: pointer;font-size: 14px; color: #333;}
.search .search-wrap dl.select dd:hover {background-color: #237B7B;color: #fff}
.search .search-wrap .search-option i{DISPLAY:inline;FLOAT:left;MARGIN:15px 0px;WIDTH:6px;POSITION:relative;HEIGHT:6px;-webkit-transition:.3s ease-in;-moz-transition:.3s ease-in;-o-transition:.3s ease-in;transition:.3s ease-in}
.search .search-wrap .search-option i em{BORDER-RIGHT:transparent 3px solid;BORDER-TOP:transparent 3px solid;LEFT:0px;OVERFLOW:hidden;BORDER-LEFT:transparent 3px solid;WIDTH:0px;BORDER-BOTTOM:transparent 0px solid;ZOOM:1;POSITION:absolute;HEIGHT:0px;_border-color:tomato;_filter:chroma(color=tomato);BORDER-TOP-COLOR:#666;TOP:1px}
.search .search-wrap .search-option i{ position:absolute; right:12px; top:15px; margin-right:8px; display:block; margin:0 ;}
.search .search-wrap .search-option i span{BORDER-RIGHT:transparent 3px solid;BORDER-TOP:transparent 3px solid;LEFT:0px;OVERFLOW:hidden;BORDER-LEFT:transparent 3px solid;WIDTH:0px;BORDER-BOTTOM:transparent 0px solid;ZOOM:1;POSITION:absolute;TOP:0px;HEIGHT:0px;_border-color:tomato;_filter:chroma(color=tomato); BORDER-TOP-COLOR:#808080}
.search .kwsbox {left: 0;position: absolute;top: 37px}
.search .sideShadow {float: left;width: 59px;height: 34px;position: relative;z-index: 99999999;background: #FBFBFB;border-right: 1px solid #D8D8D8}
.search .keyWord {color: #909090;float: left;height: 30px;line-height: 30px;overflow: hidden;padding: 0;width: 283px;text-indent:30px;border: none;background: url(../image/new_bg.gif) no-repeat -174px 7px;margin-top: 2px;background-color: #FFF;}
.search .sub-btn {border: 0;cursor: pointer;height: 36px;line-height: 34px;overflow: hidden;width: 90px;position: absolute;top: 0;right: 0;font-size:16px;color: #ffffff;transition: all .2s ease-in-out;background:#237B7B;  font-family:"microsoft yahei"}
.search .sub-btn:hover {background: #006060; }

.tel { margin-top: -4px; }
.tel dl dt{ float: right;}
.tel dl dd { float: left;}
.tel dl dt img { height: 60px;}
.tel dl dd { margin-right: 10px; padding-top: 5px; text-align: right; }
.tel dl dd font { font-size: 15px; color: #555;}
.tel dl dd p { font-size: 24px; color: #F97B47; font-weight: bold;}
.xcx { margin-right: 30px; text-align: center;}
.xcx img { display: block; width: 88px;}

.globa-nav{height:45px; box-shadow:0 1px 3px rgba(0,0,0,0.1); background:#237B7B;}
.globa-nav .allGoodsCat{height:45px;position:relative;width:250px;display:block;z-index:100;  background:url(../image/btitle.png) no-repeat #006060 25px center; }
.globa-nav .allGoodsCat .coverLay{position:absolute;width:240px;z-index:100}
.globa-nav .allGoodsCat .menuEvent{display:block;font-family:Microsoft Jhenghei;font-weight:700;height:45px;line-height:45px;text-align:center;text-decoration:none;  background: url(../image/bdown.png) no-repeat 200px center;}
.globa-nav .allGoodsCat .menuEvent .catName{font-size:15px;height:42px;line-height:42px; color:#fff}

.globa-nav .header_box{position:absolute;top:45px;right:0;z-index:103;  border-top:none; padding:0 1px; background:#FFF; box-shadow:1px 3px 5px rgba(0,0,0,.1)}
.globa-nav .header_box a{background:#ffffff;text-align:left;display:inline-block;color:#3C3C3C;border-top:1px solid #e5e5e5;}
.globa-nav .header_box a:hover{color:#CF0F02!important; background:#F6F6F6}
.globa-nav .allMenu{font-size:15px;font-weight:700;line-height:45px;text-align:center;position:relative; padding-left:20px;}
.globa-nav .allMenu a{float:left; display:inline-block;height:45px; line-height:45px;padding:0 25px; font-size:16px; font-weight:normal;    color: #fff; text-decoration:none; vertical-align:top; transition:all .2s ease-in-out;}
.globa-nav .allMenu a:hover,.globa-nav .allMenu a.on{ background:#006060;color:#fff; }
.globa-nav .allMenu span,.globa-nav ul.sideMenu2 span{   font-size:12px; font-weight:100; color:#D94800!important; margin-left:-3px; overflow:hidden;}
.globa-nav .allMenu a.index{background:#FFF;color:#E53E40; font-weight:bold}
.globa-nav ul.sideMenu2{font-size:14px;font-weight:700;height:45px; }
.globa-nav ul.sideMenu2 span{ float:left; line-height:45px;}
.globa-nav ul.sideMenu2 li{position:relative;float:left;z-index:102; background:url(https://www.of021.com.cn/style/images/xiala.png) right no-repeat}
.globa-nav ul.sideMenu2 li a{color:#333;height:45px;padding:0 10px;line-height:45px; width:92px; display:block;text-decoration:none;position:relative;z-index:9; text-align:center}
.globa-nav ul.sideMenu2 li .header_box a{color:#3C3C3C;font-weight:normal; width:90px; height:36px; line-height:36px}
.globa-nav ul.sideMenu2 li a.nav:hover,.globa-nav ul.sideMenu2 li a.current{color:#333!important; background:#FFF;}
globa-nav ul.sideMenu2 li.shopzhou{color:#fff!important; background:#fff}
/*.globa-nav .allMenu span.icon_hot{display:block;width:19px;height:23px;background:url(https://www.of021.com.cn/style/images/sicon.gif) no-repeat -19px top;position:absolute;top:-3px;right:380px;z-index:99;}*/
.globa-nav .allMenu span.ico_xia{width:11px;height:6px;background:url(https://www.of021.com.cn/style/images/li_xia.gif) no-repeat 0px top;position:absolute;top:16px;right:0px;}
.blank15{height:12px;line-height:12px;clear:both;background:#FFF;}
.blank15{height:12px;line-height:12px;clear:both;background:#FFF;}
.globa-nav ul.allMenu li span.icon_new{display:block;width:19px;height:23px;background:url(https://www.of021.com.cn/style/images/sicon.gif) no-repeat -19px top;position:absolute;top:-10px;right:0;}
.expandMenu{display:none;left:0px;position:absolute;top:45px; background: #000000 !important; opacity: 0.9;}
.hover .expandMenu{display:block;}
.all_cat{height:570px; position:absolute;width:250px;z-index:10;_padding-top:1px;_margin-top:-1px; background: rgba(70,70,70,0.7);}
.all_cat .box{height:auto; display: table; z-index:10;}
.all_cat .box_bg{height:400px; position:absolute;left:0px;top:0px;z-index:-10}
.all_cat .box .bt{width:240px;height:40px;font-size:25px;color:#FFF}
.all_cat ul{position:relative;float:left; }
.all_cat li{width:235px; display:block; border-bottom:1px dotted #aaa;padding:10px 0 10px 15px;}
.all_cat li .s1{  padding-top:10px;  background:url(../image/pull_r_icon.png) 210px 15px no-repeat}
.all_cat li .s1 a{color:#fff; font-size: 16px; padding-left:30px;}
.all_cat li .s1 h2{color:#ffffff;font-weight:normal}
.all_cat li .s1 a.web{background:url(../image/web.png) left no-repeat}
.all_cat li .s1 a.host{background:url(../image/web.png) left no-repeat}
.all_cat li .s1 a.value{background:url(../image/web.png) left no-repeat}
.all_cat li .s2{ padding-bottom:5px;}
.all_cat li .s2 a{display: inline-block; color: #ddd; font-size: 14px; min-width: 30%; text-align: left; margin-top:8px;}
.all_cat li .s2 a:hover{ color: #fff; }
.all_cat li:last-child{border:none;}


.slide_banner, .slide_banner .slide_stage{ height: 550px;overflow: hidden}
.slide_banner .slide_stage .bg{height: 550px;text-align: center}
.slide_banner .slide_stage a{display: block;width: 750px;height: 550px;text-decoration: none}
.slide_banner .slide_handdler{width: 750px;height: 12px;overflow: hidden;position: absolute;margin-top: -28px;text-align: center}
.slide_banner .slide_handdler a{display: inline-block;width: 12px;height: 12px;border-radius: 12px;overflow: hidden;vertical-align: top;margin-left: 10px;background: #fff;opacity: .5;filter: alpha(opacity=50)}
.slide_banner .slide_handdler a.first{margin-left: 525px}
.slide_banner .slide_handdler a:hover, .slide_banner .slide_handdler .current{background: #e90000;opacity: 1;filter: alpha(opacity=100)}
.slide_banner{position:relative;}
.slide_banner,.slide_banner .slide_main,.slide_main li{width:100%;min-width:100% ; display:block;}
.slide_main li{position:absolute}
.slide_nav{position:absolute;bottom:20px;right:45%; }
.root_body .slide_nav{margin-right:-260px;}
.root_body .slide_nav{margin-left:300px;}
.slide_main li a{height:550px;display:block;width:1920px;overflow:hidden;position:absolute;left:50%;top:0;margin-left:-960px;}
.slide_nav li{float:left;display:block;width:12px;height:12px;overflow:hidden;border-radius:50%;transition:all .1s ease-in-out;filter:alpha(opacity=90);-moz-opacity:0.9;-khtml-opacity: 0.9;opacity: 0.9;background:#eee;text-indent:-999em;margin-right:10px; cursor:pointer;}
.slide_nav li.on{background:#237B7B;width:12px;height:12px;margin-top:0;}



.lei{ text-align: center; padding-bottom: 40px; background: #fff; overflow: hidden; }
.lei ul li{ float: left; display: inline-block; width: 144px; font:14px/30px "microsoft yahei"; color: #333; transition: all .3s ease-in-out; }
.lei ul li p{ margin-top: 5px; }
.lei ul li a{ transition: all .3s ease-in-out; }
.lei ul li:hover{ margin-top: -8px; }
.lei ul li:hover a{ color: #68af2f; }

.index-main .index-main-title { font-size: 24px;}
.index-main .index-main-title span { color: #237B7B; margin-right: 5px;}
.main-aside { width: 244px; background: #237B7B; position: relative;}
.index-main1 .index-main-title span{ color:#42b3a8;  }
.main-aside1{ background:#42b3a8; }
.index-main2 .index-main-title span{ color:#d86262;  }
.main-aside2{ background: #d86262; }
.index-main3 .index-main-title span{ color:#4e93c3;  }
.main-aside3{ background: #4e93c3; }
.main-aside4{ background: #8060ff;  }
.index-main4 .index-main-title span{ color:#8060ff;  }
.main-aside img { display: block; width: 100%; height: 562px; object-fit: cover;}
.main-aside-text { position: absolute; top: 50px; left: 30px; color: #fff;}
.main-aside-text h1 { font-size: 24px;}
.main-aside-text p { margin-top: 4px;}
.main-aside-text a { display: block; width: 76px; height: 24px; border: 1px #fff solid; text-align: center; line-height: 24px; margin-top: 24px; color: #fff; -webkit-transition: all 500ms ease; -ms-transition: all 500ms ease; -o-transition: all 500ms ease; -moz-transition: all 500ms ease; transition: all 500ms ease;}
.main-aside-list { position: absolute; bottom: 50px; left: 22px;}
.main-aside-list ul li { float: left; margin-left: 10px; margin-top: 10px;}
.main-aside-list ul li:nth-child(2n+1) { margin-left: 0;}
.main-aside-list ul li:nth-child(1), .main-aside-list ul li:nth-child(2) { margin-top: 0;}
.main-aside-list ul li a { display: block; width: 87px; height: 30px; background: rgba(0,0,0,0.2); line-height: 30px; text-align: center; color: #fff; -webkit-transition: all 500ms ease; -ms-transition: all 500ms ease; -o-transition: all 500ms ease; -moz-transition: all 500ms ease; transition: all 500ms ease; padding: 0 5px;}
.main-aside-list ul:after { content: ''; display: block; clear: both;}
.main-aside-list ul li a:hover, .main-aside-text a:hover { background: #fff; color: #237B7B;}
.main-list { width: 1056px;}
.main-list ul:after { content: ''; display: block; clear: both;}
.main-list ul li { float: left; margin-left: 20px; margin-top: 20px;}
.main-list ul li:nth-child(1), .main-list ul li:nth-child(2), .main-list ul li:nth-child(3) { margin-top: 0;}
.main-list ul li.ad { position: relative; width: 508px;}
.main-list ul li.ad img { display: block; width: 100%; height: 271px; object-fit: cover;}
.main-list ul li.ad .text { position: absolute; top: 50%; left: 40px; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%);}
.main-list ul li.ad .text h1 { font-size: 24px;}
.main-list ul li.ad .text .prot { font-size: 22px;}
.main-list ul li.ad .text p { font-size: 16px; margin-top: 10px;}
.main-list ul li.ad .text span { display: inline-block; width: 78px; height: 26px; line-height: 26px; text-align: center; background: #237B7B; margin-top: 40px; color: #fff;}
.main-list ul li.list {float:left; width: 330px; height: 271px; padding: 15px 15px 0 15px; background: #fff; box-sizing: border-box; -webkit-transition: all 500ms ease; -ms-transition: all 500ms ease; -o-transition: all 500ms ease; -moz-transition: all 500ms ease; transition: all 500ms ease;}
.main-list ul li.list .img { overflow: hidden;}
.main-list ul li.list .img img { display: block; width: 100%; height: auto; max-height:200px; object-fit: cover;}
.main-list ul li.list .text { height: 50px; font-size: 16px; line-height: 50px; text-align: center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;  -webkit-transition: all 500ms ease; -ms-transition: all 500ms ease; -o-transition: all 500ms ease; -moz-transition: all 500ms ease; transition: all 500ms ease;}
.main-list ul li.list:hover { background: #237B7B;}
.main-list1 ul li.list:hover{ background: #42b3a8; }
.main-list2 ul li.list:hover{ background: #d86262; }
.main-list3 ul li.list:hover{ background: #4e93c3; }
.main-list4 ul li.list:hover{ background: #8060ff; }
.main-list ul li.list:hover .text { color: #fff;}
.main2 .main-list ul li.ad .text span, .main2 .main-list ul li.list:hover { background: #00cc99;}
.main2 .index-main-title span, .main2 .main-aside-list ul li a:hover, .main2 .main-aside-text a:hover { color: #00cc99;}
.main3 .main-list ul li.ad .text span, .main3 .main-list ul li.list:hover { background: #ff710d;}
.main3 .index-main-title span, .main3 .main-aside-list ul li a:hover, .main3 .main-aside-text a:hover { color: #ff710d;}
.main4 .main-list ul li.ad .text span, .main4 .main-list ul li.list:hover { background: #1695e9;}
.main4 .index-main-title span, .main4 .main-aside-list ul li a:hover, .main4 .main-aside-text a:hover { color: #1695e9;}
.main5 .main-list ul li.ad .text span, .main5 .main-list ul li.list:hover { background: #f8329d;}
.main5 .index-main-title span, .main5 .main-aside-list ul li a:hover, .main5 .main-aside-text a:hover { color: #f8329d;}
.main6 .main-list ul li.ad .text span, .main6 .main-list ul li.list:hover { background: #a22bf7;}
.main6 .index-main-title span, .main6 .main-aside-list ul li a:hover, .main6 .main-aside-text a:hover { color: #a22bf7;}


.index-case{ background: #fff; padding-bottom: 40px; margin-top: 50px; }
.title { font-size: 30px; line-height: 40px; text-align: center;}
.case-cate { text-align: center; font-size: 0; margin-top: 30px;}
.case-cate span { display: inline-block; width: 140px; height: 50px; background: #fff; line-height: 50px; cursor: pointer; border: 1px #ddd solid; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; border-left: none; font-size: 15px;}
.case-cate span:first-child { border-left: 1px #ddd solid;}
.case-cate span.cur { background: #237B7B; color: #fff; border-color: #237B7B;}
.case-cate span.cur a{ color: #fff; }
.index-case-list { display: none;}
.index-case-list:first-child { display: block;}
.index-case-list ul li { width: 310px; float: left; margin-top: 20px; margin-left: 20px;}
.index-case-list ul li:nth-child(4n+1) { margin-left: 0;}
.index-case-list ul li .img { position: relative;}
.index-case-list ul li .img img { display: block; width: 100%; height: 200px; object-fit: cover;}
.index-case-list ul li .img .mask { position: absolute; top: 0; left: 0; background: rgba(0,0,0,0.7); width: 100%; height: 100%; opacity: 0; -webkit-transition: all 500ms; -ms-transition: all 500ms; -o-transition: all 500ms; -moz-transition: all 500ms; transition: all 500ms;}
.index-case-list ul li .img .mask::before, .index-case-list ul li .img .mask::after { position: absolute; content: ''; opacity: 0; -webkit-transition: all 500ms; -ms-transition: all 500ms; -o-transition: all 500ms; -moz-transition: all 500ms; transition: all 500ms;}
.index-case-list ul li .img .mask::before { top: 20px; right: 20px; bottom: 20px; left: 20px; border-top: 1px solid #fff; border-bottom: 1px solid #fff; transform: scale(0, 1); -webkit-transform: scale(0, 1); -ms-transform: scale(0, 1); -webkit-transform-origin: 0 0; -ms-transform-origin: 0 0; transform-origin: 0 0;}
.index-case-list ul li .img .mask::after { top: 20px; right: 20px; bottom: 20px; left: 20px; border-right: 1px solid #fff; border-left: 1px solid #fff; transform: scale(1, 0); -webkit-transform: scale(1, 0); -ms-transform: scale(1, 0); transform-origin: 100% 0; -webkit-transform-origin: 100% 0; -ms-transform-origin: 100% 0;}
.index-case-list ul li:hover .mask { opacity: 1;}
.index-case-list ul li:hover .mask::before, .index-case-list ul li:hover .mask::after { opacity: 1; transform: scale(1);}
.index-case-list ul li .img .mask .text { color: #fff; text-align: center; width: 75%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.index-case-list ul li .img .mask .text span { font-size: 18px;}
.index-case-list ul li .img .mask .text i { display: block; width: 30px; height: 30px; background: url(../image/more.png) no-repeat center center; margin: 0 auto; margin-top: 20px;}


.index-news{ background: #fff; padding: 60px 0; }
.index-news-list { margin-top: 30px; }
.index-news-list ul li { width: 420px; float: left; margin-left: 20px;}
.index-news-list ul li:first-child { margin-left: 0;}
.index-news-list ul:after { content: ''; display: block; clear: both;}
.index-news-list ul li dl dt .index-news-img img { display: block; width: 100%; height: 130px;}
.index-news-list ul li dl dt .index-news-txt { line-height: 60px; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between;}
.index-news-list ul li dl dt .index-news-title { font-size: 18px;}
.index-news-list ul li dl dt .index-news-more { color: #999;}
.index-news-list ul li dl dd { background: #fff; padding: 0 10px; height: 42px; line-height: 42px; border-bottom: 1px #ddd solid;}
.index-news-list ul li dl dd:last-child { border-bottom: none;}
.index-news-list ul li dl dd a { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between;}
.index-news-list ul li dl dd .index-news-text { width: 74%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.index-news-list ul li dl dd:hover .index-news-text { color: #237B7B;}

.footer { padding: 40px 0; background: #ebebeb; color: #555;}
.f-nav{ overflow: hidden; }
.f-nav li { float: left; margin-right: 80px; }
.f-nav li.fist { width: 200px; margin-right: 40px; }
.f-nav dt { margin-bottom: 10px;}
.f-nav dt a { font-size: 16px; color: #000; line-height: 30px; }
.f-nav dd a { line-height: 2; }
.f-nav .pro dd { float: left; min-width: 100px; }
.footer-r .qr-code { width: 140px; text-align: center; font: 14px/24px "Microsoft yahei";}
.footer-r .qr-code img { display: block; width: 100%;}
.footer-r .hotline { margin-left: 20px; width: 195px; }
.footer-r .hotline p{  float: left; width: 100%; font: 16px/25px "Microsoft yahei"; }
.footer-r .hotline strong { font: 24px/30px "Microsoft yahei"; color: #F97B47;display: block; }
.footer-r .hotline .layer-btn { float: left; margin-top: 10px; width: 192px; height: 46px; background: #F97B47; color: #fff; line-height: 46px; text-align: center; }
footer { background: #ebebeb; border-top: 1px solid #ddd;  padding: 20px 0; text-align: center; color: #666; overflow: hidden;}
footer p { line-height: 24px;}
footer p a { color: #666;}
.position { line-height: 60px; }
.position a{ padding: 0 5px; }

.sidebar { width: 280px; margin-bottom: 22px; box-shadow: 0 0 10px rgba(0,0,0,0.17); border-top-right-radius: 15px; }
.sidebar-title { padding: 30px 0 20px 25px; line-height: 28px; font-size: 20px; color: #fff; font-weight: bold; background:#237B7B; }

.sidebar-ul { background: #fff; }
.sidebar-ul .firstli { padding: 14px 20px 14px 25px; border-bottom: 1px solid #e7e7e7; }
.sidebar-ul .afirst { font-size: 18px; color: #666; line-height: 40px; display: block; padding-left: 15px; background: url('../image/dot.jpg') no-repeat left center; }
.sidebar-ul .afirst .icon-right1 { float: right; margin-top: 12px; width: 16px; height: 16px; background:url(../image/pull_r_icon.png) center center no-repeat #666; border-radius: 10px;}
.sidebar-ul .firstli .afirst:hover .icon-right1,.sidebar-ul .on .afirst .icon-right1{ background:url(../image/pull_r_icon.png) center center no-repeat #237B7B; }
.sidebar-ul a:hover,.sidebar-ul .subnav a:hover{ color:#237B7B; }
.sidebar-ul .on>a,.sidebar-ul .subnav a.on{ color:#237B7B; }
.sidebar-ul .subnav a { display: inline-block; min-width: 71px; font-size: 14px; line-height: 30px; color: #666; }
.region-hotline { padding: 40px 0 30px; text-align: center; background: #fff; box-shadow: 0 0 10px rgba(0,0,0,0.17); }
.region-hotline h3 { font-size: 16px; color: #666; }
.region-hotline span { margin: 10px 0; display: block; color: #ccc; }
.region-hotline p { color: #237B7B; line-height: 30px; }
.region-hotline p strong{ font-size: 18px; font-weight: bold; }
.region-hotline img { margin-top: 15px; }

.news-tui{ padding: 15px 0; background: #fff; }
.news-tui li { height: 40px; padding: 0 15px; }
.news-tui li span { float: left; width: 18px; font: 12px/17px "Microsoft yahei"; height: 18px; color: #fff; background: #aaa;text-align: center; border-radius: 50%; margin-top: 11px; margin-right: 5px; }
.news-tui li:first-child span,.news-tui li:nth-child(2) span,.news-tui li:nth-child(3) span { background: #237B7B; color: #fff }
.news-tui li a { display: block; float: left; font: 14px/40px "Microsoft yahei"; color: #666; }
.news-tui li a:hover { color: #237B7B !important; }


.pro-list .con_r_top{ float: left; width: 972px; margin:0 14px; background:#fff; border: 1px solid #e3e3e3; padding:15px; font: 14px/30px "微软雅黑"; color: #666; box-sizing: border-box; }
.pro-list .con_r_top p{ margin-bottom:15px;}
.pro-list .con_r_top p:last-child{margin-bottom:0; }
.pro-list .con_r_top a{ color:#237B7B; padding: 0 15px; font-weight:bold; display: inline-block; }
.pro-list .con_r_top a:hover{ color:#006060; }
.pro-list .con_r_top a.on{ background: #006060; color: #fff; }

.pro-list { width: 1000px; }
.pro-list ul{ float: left; overflow: hidden; margin-bottom: 20px; }
.pro-list ul li { float: left; width: 33.33%; }
.pro-item { margin: 14px; background: #fff; transition: all 0.3s linear; box-shadow: 0 0 15px rgba(0,0,0,0.15); border: 1px solid rgba(255,255,255,0); box-sizing: border-box; }
.pro-item .pic { overflow: hidden;height:100%;}
.pro-item .pic img { width: 100%; transition: all 0.5s linear;height: 202px;}
.pro-item .intro { padding: 20px 20px 45px; background: url('../image/icon-jiao.jpg') no-repeat right bottom; }
.pro-item .intro h4 { font-size: 16px; color: #000; line-height: 30px; margin-bottom: 10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pro-item .intro p { color: #666; }
.pro-item:hover .pic img { transform: scale(1.1); }
.pro-item:hover { border: 1px solid #237B7B; box-sizing: border-box; }
.pro-item:hover .intro h4 { color: #237B7B; }


.product { width: 1000px;}
.product ul li { min-height: 220px; padding: 30px; margin-top: 20px; background: #fff; position: relative; box-shadow: 0 0 15px rgba(0,0,0,0.15);}
.product ul li:first-child { margin-top: 0;}
.product ul li .img { width: 330px; overflow: hidden; position: absolute; left: 30px;}
.product ul li .img img { display: block; width: 100%; height: 220px; object-fit: cover; transition: all 0.3s; }
.product ul li .text { padding: 20px 0 0 370px;}
.product ul li .text strong { font-size: 20px;}
.product ul li .text p { line-height: 24px; max-height: 72px; color: #777; overflow: hidden; margin: 34px 0;}
.product ul li .text span { display: block; width: 100px; height: 34px; line-height: 34px; text-align: center; background: #333; color: #fff;}
.product ul li:hover .text strong { color: #237B7B;}
.product ul li:hover img{  transform: scale(1.05, 1.05);  -webkit-transform: scale(1.05, 1.05); }
.product ul li:hover .text span { background: #237B7B;}
.page {float: left; width: 100%; text-align: center; margin: 20px 0; font-size: 0; overflow: hidden;}
.page span{  display:inline-block; font-size:14px; border:1px solid #ddd; margin-left:-1px;  background-color:#FFF; cursor:pointer;}
.page span.page-status{ display:none;}
.page span.page-num{ line-height:40px; border:none; border-left:1px solid #ddd;}
.page span a{line-height:40px; height:40px; padding:0 15px; color: #666; display:inline-block;}
.page span a.page-num{ border-right:1px solid #ddd;}
.page span a.page-num-current,.page span a:hover{color:#fff; background-color:#237B7B;}


.zhuang{ width: 100%; background:url(../image/zhuang.jpg) top center repeat-y; background-attachment: fixed; margin: 50px 0 0; padding: 70px 0; font: 18px/50px "Microsoft yahei"; color: #fff;  overflow: hidden; }
.zhuang ul{ float: left; }
.zhuang ul li{ float: left; padding: 0 45px; border: 1px solid #fff; margin-right: 25px; position: relative; }
.zhuang ul li:before{ content: ""; position: absolute; left: 0; top: 25px; width: 25px; height: 1px; background: #fff; }
.zhuang ul li:after{ content: ""; position: absolute; right: 0; top: 25px; width: 25px; height: 1px; background: #fff; }
.zhuang ul li span{ font-size: 20px; font-weight: 500; color: #F97B47; }
.zhuang a{ float: right; padding: 0 70px; background: #F97B47; color: #fff; }
.zhuang a:hover{ box-shadow: rgba(0, 0, 0, .5) 0px 2px 10px; background:#f9652d;  }


.diqu{ margin-bottom: 30px; }
.diqu .title{ width:100%; text-align:center; font: 28px/100px "Microsoft yahei"; font-weight: bold; color: #333;}
.diqu dl{ width: 100%; font: 14px/27px "Microsoft yahei"; border: 1px solid #eee; border-top: none; background: #fff; overflow: hidden; box-sizing: border-box; }
.diqu dl:nth-child(2){ border-top: 1px solid #eee; }
.diqu dl a{ color: #333; }
.diqu dl dt{ float: left; width: 100px; border-right: 1px solid #eee; font: 14px/60px "Microsoft yahei"; text-align: center; }
.diqu dl dd{ float: left; width: 1190px; padding:15px 10px; box-sizing: border-box; }
.diqu dl dd a{ padding: 0 15px; color: #888; }
.diqu dl dd a:hover{ color: #555; }
.diqu dl dd a.on{ color: #fff; background: #237B7B; display: inline-block; }



.side{position:fixed;width:78px;right:0;top:50%;margin-top:-200px;z-index:100;border:1px solid #e0e0e0;background:#fff;border-bottom:0}
.side ul li{width:78px;height:78px;float:left;position:relative;border-bottom:1px solid #e0e0e0;color:#333;font-size:14px;line-height:38px;text-align:center;transition:all .3s;cursor:pointer}
.side ul li:hover{background:#68af2f;color:#fff}
.side ul li:hover a{color:#fff}
.side ul li i{height:25px;margin-bottom:1px;display:block;overflow:hidden;background-repeat:no-repeat;background-position:center center;background-size:auto 25px;margin-top:14px;transition:all .3s}
.side ul li i.bgs1{background-image:url(../image/right_pic5.png)}
.side ul li i.bgs2{background-image:url(../image/right_pic7.png)}
.side ul li i.bgs3{background-image:url(../image/right_pic2.png)}
.side ul li i.bgs4{background-image:url(../image/right_pic1.png)}
.side ul li i.bgs5{background-image:url(../image/right_pic3.png)}
.side ul li i.bgs6{background-image:url(../image/right_pic6_on.png)}
.side ul li:hover i.bgs1{background-image:url(../image/right_pic5_on.png)}
.side ul li:hover i.bgs2{background-image:url(../image/right_pic7_on.png)}
.side ul li:hover i.bgs3{background-image:url(../image/right_pic2_on.png)}
.side ul li:hover i.bgs4{background-image:url(../image/right_pic1_on.png)}
.side ul li:hover i.bgs5{background-image:url(../image/right_pic3_on.png)}
.side ul li .sidebox{position:absolute;width:78px;height:78px;top:0;right:0;transition:all .3s;overflow:hidden}
.side ul li.sidetop{background:#68af2f;color:#fff}
.side ul li.sidetop:hover{opacity:.8;filter:Alpha(opacity=80)}
.side ul li.sideewm .ewBox.son{width:200px;display:none;color:#363636; background: #fff; text-align:center; padding: 10px; box-sizing: border-box; position:absolute;left:-200px;top:0;border:1px solid #e0e0e0}
.side ul li.sideewm .ewBox img{ max-width: 100%; }
.side ul li.sideetel .telBox.son{width:250px;height:auto;display:none;color:#fff;text-align:left;position:absolute;left:-250px;top:0;background:#68af2f}
.side ul li.sideetel .telBox dd{display:block;height:78px;overflow:hidden;padding-left:55px;line-height:24px;font-size:16px}
.side ul li.sideetel .telBox dd span{ overflow:hidden; font:16px/78px "Microsoft yahei";}
.side ul li.sideetel .telBox dd.bgs1{background:url(../image/right_pic8.png) 18px center no-repeat; background-size: 11%; background-color:#f19b31}
.side ul li.sideetel .telBox dd.bgs2{background:url(../image/right_pic9.png) 18px center no-repeat; background-size: 11%;}
.side ul li:hover .son{display:block!important;animation:fadein 1s}
@keyframes fadein{from{opacity:0}
to{opacity:1}
}





/*图片切换加载*/
.prolist{width:100%; border:1px solid #eee; padding:10px 0 0 0; overflow: hidden; box-sizing:border-box; }
.prolist .hd{ width:100%; font:14px/45px "Microsoft yahei"; float:left; box-sizing:border-box; background:#fff; text-align:center}
.prolist .hd li{ display:inline-block; padding:0 17px;cursor:pointer;}
.prolist .hd li.on{ font:14px/45px "Microsoft yahei"; background:#237B7B; color:#fff; }
.prolist .bd ul{width:100%; padding:20px 0 0 0;  float:left; background: #fff;}
.prolist .bd li{width:300px; margin:0 0 20px 20px; float:left; display:inline; text-align:center;}
.prolist .bd li img{ width:100%; height:200px; display:block; background:url(https://www.of021.com.cn/style/images/loading.gif) center center no-repeat; }
.prolist .bd li p{ width:100%; height:35px; font:14px/35px "Microsoft yahei"; color:#333; float:left; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical;}
.prolist .bd li p a{color:#333; display: block; }
.prolist .bd li:hover p a{ color:#237B7B;}

.new-list{  margin:30px 0 0 0; overflow:hidden}
.new-list-ul{ width:48%; }
.new-list-ul h2{ font:18px/50px "Microsoft yahei"; color:#333; font-weight:bold;}
.new-list-ul h2 a{ float:right; font:12px/50px "Microsoft yahei"; color:#777;}
.new-list-ul ul{ width:100%; }
.new-list-ul ul li{ float:left; width:100%; font:14px/45px "Microsoft yahei"; border-bottom: 1px dashed #eee; color:#555;}
.new-list-ul ul li:last-child{ border: none; }
.new-list-ul ul li a{ color:#555;}
.new-list-ul ul li a:hover{ color:#237B7B;}
.new-list-ul ul li span{ float: right; color: #888; }
.dilist{ width: 100%; margin-bottom: 30px; margin-top: 10px; border-top:1px dashed #ddd;   }
.dilist .title{ width: 100%; font: 14px/35px "Microsoft yahei"; border-bottom: 1px dashed #ddd; margin-bottom: 20px; }
.dilist ul{ overflow: hidden; margin-bottom: 20px; }
.dilist ul li{  float: left; width: 48%; font: 14px/45px "Microsoft yahei"; box-sizing: border-box; transition: all .3s; }
.dilist ul li:nth-child(2n){ float: right; }
.dilist ul li a{ color: #333; display: inline-block;}
.dilist ul li span{ color: #888; float: right; }
.dilist ul li a:hover{ color: #237B7B; }


.common { padding: 40px 0;}
.common-title { font-size: 20px;}
.common-title span { display: inline-block; width: 4px; height: 16px; background: #237B7B; margin-right: 5px;}
.newgg { margin-top: 20px;}
.newggls { padding-top: 10px;}
.newggls ul li { padding: 0 10px; overflow: hidden; line-height: 35px;}
.newggls ul li a { width: 70%; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; float: left;}
.newggls ul li span { float: right;}
.news-list ul li { width: 390px; padding: 15px; background: #fff; float: left; margin-left: 20px; margin-top: 20px;}
.news-list ul li:nth-child(3n+1) { margin-left: 0;}
.news-list ul li:nth-child(1), .news-list ul li:nth-child(2), .news-list ul li:nth-child(3) { margin-top: 0;}
.news-list ul li h1 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-bottom: 10px;}
.news-list ul li .img .i { width: 124px; overflow: hidden; float: left; margin-left: 9px;}
.news-list ul li .img .i:first-child { margin-left: 0;}
.news-list ul li .img .i img { display: block; width: 100%; height: 124px; object-fit: cover;}
.news-list ul li:hover h1 { color: #237B7B;}
@media (max-width: 1380px) {
.news-list ul li { width: 356px; margin-left: 21px;}
.news-list ul li .img .i { width: 112px; margin-left: 10px;}
.news-list ul li .img .i img { height: 112px;}
}
.case { width: 1020px;}
.case ul li { width: 290px; padding: 15px; float: left; margin-left: 20px; margin-bottom: 20px; background: #fff;}
 
.case ul li .img { overflow: hidden;}
.case ul li .img img { display: block; width: 100%; height: 180px; object-fit: cover; -webkit-transition: all 500ms ease; -ms-transition: all 500ms ease; -o-transition: all 500ms ease; -moz-transition: all 500ms ease; transition: all 500ms ease;}
.case ul li .text { text-align: center; margin-top: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.case ul li img:hover { transform: scale(1.2); -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -ms-transform: scale(1.2);}
.case ul li .text:hover { color: #237B7B;}

.honor ul li .img img{ height: 350px; }

@media (max-width: 1380px) {
.case { width: 976px;}
.case ul li { width: 194px;}
.case ul li .img img { height: 194px;}
}
.news { width: 995px; margin-left: 20px;}
.news ul li { width: 100%; padding: 20px; background: #fff; float: left; margin-top: 20px; box-sizing:border-box; box-shadow: 0 0 15px rgba(0,0,0,0.15); border: 1px solid rgba(255,255,255,0);}
.news ul li:nth-child(1){ margin-top: 0;}
.news ul li img { width: 225px; height: 140px; float: left; border: 1px solid #eee;}
.news ul li .img { width: 700px; float: right;}
.news ul li .img font { font: 18px/35px "Microsoft yahei"; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.news ul li .img span{ float: right; font: 14px/35px "Microsoft yahei";  color: #666; }
.news ul li .img p { font-size: 14px; line-height: 22px; color: #666; margin: 5px 0; }
.news ul li .img .tag{ font: 12px/24px "Microsoft yahei"; color: #666; margin-top: 10px; }
.news ul li .img .tag a{ color: #333; margin-right: 10px; }
.news ul li:hover font{ color: #237B7B; }

.case-list ul li { width: 214px; padding: 15px; float: left; margin-left: 20px; margin-top: 20px; background: #fff;}
.case-list ul li:nth-child(1), .case-list ul li:nth-child(2), .case-list ul li:nth-child(3), .case-list ul li:nth-child(4), .case-list ul li:nth-child(5) { margin-top: 0;}
.case-list ul li:nth-child(5n+1) { margin-left: 0;}
.case-list ul li .img { overflow: hidden;}
.case-list ul li .img img { display: block; width: 100%; height: auto; object-fit: cover; -webkit-transition: all 500ms ease; -ms-transition: all 500ms ease; -o-transition: all 500ms ease; -moz-transition: all 500ms ease; transition: all 500ms ease;}
.case-list ul li .text { text-align: center; margin-top: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.case-list ul li img:hover { transform: scale(1.2); -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -ms-transform: scale(1.2);}
.case-list ul li .text:hover { color: #237B7B;}
@media (max-width: 1380px) {
.case-list ul li { width: 194px;}
.case-list ul li .img img { height: 194px;}
}
.box {  margin-bottom: 20px; }
.detail-l { width: 815px; padding: 30px; background: #fff; margin-bottom: 30px;}
.detail-l .detail-info { padding: 0 0 30px 350px; margin-bottom: 30px; border-bottom: 1px #ddd solid; position: relative; min-height: 250px;}
.detail-l .detail-info .img { width: 330px; overflow: hidden; position: absolute; left: 0;}
.detail-l .detail-info .img img { display: block; width: 100%; height: 250px; object-fit: cover;}
.detail-l .detail-info .text{ }
.detail-l .detail-info .text h1 { font-size: 22px; line-height: 36px; font-weight: bold; color: #F97B47;}
.detail-l .detail-info .text h2 { color: #999; margin: 8px 0 14px 0;}
.detail-l .detail-info .text h2 span { margin-right: 10px;}
.detail-l .detail-info .text p { line-height: 24px;}
.detail-l .detail-con p { font-size: 14px; line-height: 24px;}
.detail-l .detail-con .txt p,.detail-l .detail-con .txt span{ font: 15px/30px "Microsoft yahei" !important; color:#444 !important; }
.detail-l .detail-con .txt strong{ color:#555 !important; }
.detail-l .detail-con p img { display: block; max-width: 100%; height: auto !important;  margin: 15px auto;}
.procs { margin: 10px auto 0;}
.procs ul { overflow: hidden;}
.procs ul li { width: 15%; float: left; text-align: center; border: 1px solid #c4c4c4; line-height: 33px; border-bottom: 0; border-right: 0; background: #eee; color: #333; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; box-sizing: border-box;}
.procs ul li:nth-child(2n) { width: 35%; background: #fff; color: #333; font-size: 12px;}
.procs ul li.tong{ width: 85%; font-size: 12px;border-right: 1px solid #c4c4c4; }
.procs ul li:nth-child(17), .procs ul li:nth-child(18), .procs ul li:nth-child(19), .procs ul li:nth-child(20) { border-bottom: 1px solid #c4c4c4;}
.procs ul li:nth-child(4), .procs ul li:nth-child(8), .procs ul li:nth-child(12), .procs ul li:nth-child(16), .procs ul li:nth-child(20) { border-right: 1px solid #c4c4c4;}
.detail-con h3 { line-height:25px !important; font-size: 20px; color:#000; font-weight: bold; border-left: solid 6px #237B7B; padding-left: 10px !important; margin-top:10px; margin-bottom: 15px;}
.detail-con h3 span{ font-weight:bold; color: #237B7B;}
.new-text { border-bottom: 1px dashed #eee; margin-bottom: 10px;}
.new-text h1 { font-size: 22px; line-height: 36px; color: #ff710d;}
.deats { font-size: 13px; line-height: 36px; color: #999;}
.detail-con p,.detail-con p span{ font:15px/30px "Microsoft yahei" !important; color:#555;}
.deats span { margin-right: 25px; font-style: italic;}
.detail-con>span,.detail-con a,.detail-con strong{ color: #333; font-weight:bold;}

.detail-l .detail-share { margin-top: 10px;}
.detail-l .detail-share .bdsharebuttonbox { display: inline-block; vertical-align: middle;}
.detail-l .detail-link { margin: 24px 0;}
.detail-l .detail-link p { width: 100%; line-height: 30px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.detail-l .detail-link p a:hover { color: #237B7B;}
.detail-l .detail-link:after { content: ''; display: block; clear: both;}
.detail-l .detail-comment .header { font-size: 0; padding-bottom: 14px; border-bottom: 1px #ddd solid;}
.detail-l .detail-comment .header span { font-size: 18px;}
.detail-l .detail-comment .header i { display: inline-block; width: 20px; height: 24px; background: url(../image/comment.png) no-repeat center center; vertical-align: top; margin-right: 6px;}

.tags{ font: 14px/30px "Microsoft yahei"; color: #333; padding-top:10px; margin-top: 20px; border-top: 1px dashed #666; }
.tags a{ margin-right: 10px; color: #237B7B; }

.comment-list ul li { padding: 20px 0 20px 60px; position: relative; border-bottom: 1px #ddd solid;}
.comment-list ul li .img { width: 50px; height: 50px; border-radius: 50%; overflow: hidden; position: absolute; left: 0;}
.comment-list ul li .img img { display: block; width: 100%;}
.comment-list ul li .text h1 { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; margin-top: 6px;}
.comment-list ul li .text h1 span.name { font-size: 16px;}
.comment-list ul li .text h1 span.time { color: #999; line-height: 21px;}
.comment-list ul li .text p { margin-top: 14px; line-height: 24px;}
.detail-l .detail-comment .comment { margin-top: 20px;}
.detail-l .detail-comment .comment textarea { height: 106px; width: 100%; border: 1px #ddd solid; box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; -moz-box-sizing: border-box; resize: none; padding: 10px;}
.detail-l .detail-comment .comment button { width: 120px; height: 40px; background: #237B7B; color: #fff; line-height: 40px; text-align: center; outline-style: none; border: none; cursor: pointer; margin-top: 10px; float: right;}
.detail-l .detail-comment .comment button:hover { opacity: 0.9;}
.detail-r { width: 400px;}
.detail-r .shop { padding: 0 15px 15px 15px; background: #fff;}
.detail-r .shop:after { content: ''; display: block; clear: both;}
.detail-r .shop h2 { width: 240px; height: 34px; background: #237B7B; text-align: center; line-height: 34px; font-size: 18px; color: #fff; margin: 0 auto; margin-bottom: 14px;}
.detail-r .shop .shop-info { width: 260px;}
.detail-r .shop .shop-info .text { padding-left: 72px; position: relative; line-height: 24px;}
.detail-r .shop .shop-info .text label { position: absolute; left: 0;}
.detail-r .shop .shop-img img { width: 90px; display: block; border: 1px #237B7B solid;}
.detail-r .recommend { margin-top: 30px;}
.detail-r .recommend ul li { width: 160px; padding: 15px; float: left; margin-left: 20px; margin-top: 20px; background: #fff;}
.detail-r .recommend ul li:nth-child(2n+1) { margin-left: 0;}
.detail-r .recommend ul li .img { overflow: hidden;}
.detail-r .recommend ul li .img img { display: block; width: 100%; height: 105px; object-fit: cover; -webkit-transition: all 500ms ease; -ms-transition: all 500ms ease; -o-transition: all 500ms ease; -moz-transition: all 500ms ease; transition: all 500ms ease;}
.detail-r .recommend ul li .text { text-align: center; margin-top: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.detail-r .recommend ul li img:hover { transform: scale(1.2); -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -ms-transform: scale(1.2);}
.detail-r .recommend ul li .text:hover { color: #237B7B;}

.content { width: 940px; padding: 30px; background: #fff; box-shadow: 0 0 15px rgba(0,0,0,0.15); }
.content .con-title { font-size: 24px; text-align: center;}
.content .about { margin-top: 30px;}
.content .about p,.content .about span{ font-weight:inherit;}
.content .about h3{ font-weight:bold;}
.content .about p { line-height: 24px; margin:20px 0;}
.content .about p img { display: block; max-width: 100%; margin: 0 auto;}
.content .contact { margin-top: 30px;}
.content .contact table { width: 100%; border-collapse: collapse;}
.content .contact table tr td { border: 1px #ddd solid; padding: 14px 20px;}
.content .contact table tr td.t1 { width: 120px;}
.content .map { height: 524px; border: 1px #ddd solid; box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; -moz-box-sizing: border-box; margin-top: 20px;}
.about input,.about textarea{ width: 100%; padding:0 10px; margin-bottom: 20px; color: #333; border: 1px solid #ddd; box-sizing: border-box; }
.about input{ font: 14px/45px "Microsoft yahei"; }
.about textarea{ min-height: 90px; font: 14px/30px "Microsoft yahei";  }
.about button{ cursor: pointer; background: #237B7B; color: #fff; font: 14px/45px "Microsoft yahei"; padding: 0 40px; }
.about button:hover{ background: #006060; }
@media (max-width: 1380px) {
.content { width: 896px;}
}


.index-about{ color: #fff; padding: 60px 0; background-image: url(../image/aboutbg.jpg); background-attachment: fixed; background-repeat:repeat-y; background-position: top 60px center; }
.Alist { overflow: hidden; margin: 40px 0; }
.Alist li { float: left; width: 33.33%; text-align: center; }
.Alist li strong { font-size: 72px; display: block; font-family: 'DINCond-Mediumf17bc02ea5a8d'; line-height: 80px; }
.myform2 { margin: 0 20px; }
.myform2 .form-item { float: left; margin: 0 7px; }
.myform2 input { background: #fff; width: 320px; height: 40px; line-height: 30px; padding: 10px; }
.myform2 button { background: #F97B47; font-size: 16px; color: #fff; font-weight: bold; width: 150px; height: 60px; cursor: pointer; }

.about { margin-top: 20px; margin-bottom: 40px; overflow: hidden;}
.about img { float: left;}
.about .abcon { width: 100%; font: 16px/30px "Microsoft yahei"; float: right;}
.about .abcon p { font-size: 14px; line-height: 30px;}
.links { width: 1300px; margin: 20px auto; color: #666;}
.links a { color: #666; margin-right: 10px;}

    .nbanner {  
               width:100%;  
               position:relative;  
               overflow:hidden;  
               height:300px;  
           }  
           .nbanner-img {  
               width:1920px; /*图片宽度*/  
               position:absolute;  
               left:50%;  
               margin-left:-960px; /*图片宽度的一半*/  
           }